﻿<%@ page language="java" pageEncoding="UTF-8"%>
<%@ page import="com.crm.util.RequestEx"%>
<%@ page import="com.crm.util.SESSION"%>
<%@ page import="com.crm.po.Users"%>
<%@ page import="com.crm.service.CustomerService"%>
<%
	String path = request.getContextPath();
	String treeid = RequestEx.getStringTrim(request.getParameter("treeid"));
	Object obj = request.getSession(true).getAttribute(SESSION.USER_SESSION_KEY);
	Users users = null;
	if(obj != null){
		users = (Users) obj;
	}
	
	CustomerService service = new CustomerService();
	int cusCount = service.getCustomerCountByTreeid(treeid, "Y");

%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>  
    <title>CRM客户管理</title>
    <link rel="icon" mce_href="<%=path%>/images/title_logo.ico" href="<%=path%>/images/title_logo.ico" type="image/x-ico"/>
    <link rel="shortcut icon" mce_href="<%=path%>/images/title_logo.ico" href="<%=path%>/images/title_logo.ico" type="image/x-ico"/>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta content="text/html;charset=utf-8" http-equiv="Content-Type"/>	
	<link rel="stylesheet" type="text/css" href="<%=path%>/js/easyui1.3.2/themes/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="<%=path%>/js/easyui1.3.2/themes/icon.css">	
	<script type="text/javascript" src="<%=path%>/js/easyui1.3.2/jquery-1.8.0.min.js"></script>
	<script type="text/javascript" src="<%=path%>/js/easyui1.3.2/jquery.easyui.min.js"></script>
	<script type="text/javascript" src="<%=path%>/js/easyui1.3.2/locale/easyui-lang-zh_CN.js"></script>
	<script type="text/javascript" src="<%=path%>/js/My97DatePicker/WdatePicker.js"></script>
	<style type="text/css">
		body,td,th,div{
 			font-size:12px;
		}
	</style>
  </head>
  
  <body style="margin:0;padding:0" class="easyui-layout">
    <script type="text/javascript">

	var datagrid;
	var url = "<%=path%>/cus.do";

	//准备新增数据
	function readySave(){
		document.getElementById("saveAndGoon").style.display="inline";
		$('#customerSaveOrUpdate').dialog({  
			title: '新增',  
			width: 800,
			height: 320,
			closed: false,  
			cache: false,   
			modal: true,
			onClose:function(){$('#customerSaveOrUpdateForm').form('clear');}
		});
	}
	//新增数据
	function doSave(isContinue){		
		$("#customerSaveOrUpdateForm").form('submit', { 
	        url: url + '?method=saveOrUpdateCustomer&treeid=<%=treeid%>',	        
			success:function(data){
				if('ok' == data){
					if(isContinue){
						//$('#customerSaveOrUpdateForm').form('clear');
					}else{
						$('#customerSaveOrUpdate').dialog('close');
					}					
					datagrid.datagrid('reload');
				}else{
					$.messager.alert('提示', data, 'info');
				}
			},
			error : function() {
			
			}
		});
	}

	//修改数据
	function doUpdate(){
		var node = datagrid.datagrid('getSelected');
		document.getElementById("saveAndGoon").style.display="none";
		$('#customerSaveOrUpdate').dialog({  
			title: '修改',  
			width: 800,
			height: 320,
			closed: false,  
			cache: false,   
			modal: true,
			onClose:function(){$('#customerSaveOrUpdateForm').form('clear');}
		});
		$('#customerSaveOrUpdateForm').form('load',{
			cid: node.cid,
			name: node.name,			
			linkman: node.linkman,
			tel: node.tel,
			phone: node.phone,
			email: node.email,
			address: node.address,
			product: node.product,
			spec: node.spec,
			price: node.price,
			remark: node.remark,
			sort: node.sort
		});	
	}

	//删除数据
	function doDelete(){
		var node = datagrid.datagrid('getSelected');
		//删除确认
		$.messager.confirm('提示','<br>您确定删除选中的数据吗?',function(r){ 
			if(r){ 
				//执行删除
				var cids = "'" + node.cid + "'";

				$.ajax({
					url : url + '?method=deleteCustomers&treeid=<%=treeid%>',
					type : 'POST',
					data : {cids : cids},
					success : function(data, textStatus) {
						if('ok' == data){
							datagrid.datagrid('load');
						}else{								
							$.messager.alert('提示', data, 'info');
						}		
					}
				});
			} 
		});
	}
	//查询
	function doQuery(){
		datagrid.datagrid('options').url = url+'?method=getCustomerList&treeid=<%=treeid%>&islive=Y';
		var queryParams = datagrid.datagrid('options').queryParams;
		
		if($.trim($("#name").val()).length == 0 && 
		   $.trim($("#linkman").val()).length == 0 && 
		   $.trim($("#product").val()).length == 0 && 
		   $.trim($('#fromDate').val()).length == 0 && 
		   $.trim($('#toDate').val()).length == 0){
			   
		   	queryParams.name = "";
		   	queryParams.linkman = "";
		   	queryParams.product = "";
		   	queryParams.fromDate = "";
		   	queryParams.toDate = "";
		}else{
			queryParams.name = $("#name").val();
			queryParams.linkman = $("#linkman").val();
			queryParams.product = $("#product").val();
			queryParams.fromDate = $('#fromDate').val();
			queryParams.toDate = $('#toDate').val();
		}
		datagrid.datagrid('load');
	}
	
	//定义datagrid列模型
	var columns = [[
		{field:'oper',title:'操作',width:70,formatter:formatOper},
		{field:'cid',title:'客户主键',width:20,hidden:true},
		{field:'name',title:'供应商',width:220,sortable:true},
		{field:'linkman',title:'联系人',width:60,sortable:true},
		{field:'sex',title:'性别',width:30,hidden:true},
		{field:'age',title:'年龄',width:30,hidden:true},
		{field:'tel',title:'固定电话',width:160,sortable:true},
		{field:'phone',title:'移动电话',width:120,sortable:true,hidden:true},
		{field:'email',title:'电子邮箱',width:120,sortable:true,hidden:true},
	
                {field:'product',title:'产品',width:200,sortable:true},
                {field:'address',title:'地址',width:160,sortable:true},
		{field:'spec',title:'规格',width:160,sortable:true,hidden:true},
		{field:'price',title:'价格',width:60,formatter:formatPrice,sortable:true,hidden:true},
		{field:'remark',title:'备注',width:150},
		{field:'creater',title:'创建用户',width:100},
		{field:'updater',title:'最后修改用户',width:100},
		{field:'creattime',title:'创建时间',width:115,formatter:formatDate},
		{field:'updatetime',title:'修改时间',width:115,formatter:formatDate},		
		{field:'sort',title:'排序',width:30,sortable:true}
	]];

	//入口
	$(function(){
		datagrid = $('#datagrid');
		$(datagrid).datagrid({
			url:url+'?method=getCustomerList&treeid=<%=treeid%>&islive=Y', 
			toolbar:'#tb',
			columns:columns,
			title:'', 
			loadMsg:'正在处理...',
			iconCls:'', 
			nowrap: true, 
			remoteSort: false,
			rownumbers: true,
			autoRowHeight: false,
			autoRowWidth: true,             
			animate:true, 
			singleSelect: true,
			collapsible: true, 
			fitColumns: false,//自动充满列
			fit:true,//自动充满浏览器区域
			idField:'cid', 
			showFooter: false,
			striped:true,//斑马线
			pagination:true,
			pageSize:50,
			onClickRow:function(rowIndex, rowData){
				viewDetails(rowData);
			},
			onDblClickRow:function(rowIndex, rowData){
				<%if(users.getCusAuth().indexOf("AUTH_U") >= 0){
				%>
				doUpdate();
				<%	
				}%>				
			},
			onLoadSuccess:function(data){
				var p = datagrid.datagrid('getPager');  
				$(p).pagination({
					<%if(users.getCusAuth().indexOf("AUTH_E") >= 0){%>
					buttons : [{
								text:'导出',
								handler:function(){
									readyExport();
								}
							   }],
					<%}%>
					pageList:[50, 100, 200, 500, <%=cusCount <= 500 ? "1000" : cusCount + ""%>]
			    });  
			}
		}); 
	}); 
	
	//预览文件数据图片
	function viewDetails(row){
		document.getElementById("nameView").innerText = row.name;
		document.getElementById("linkmanView").innerText = row.linkman;	
		document.getElementById("productView").innerText = row.product;
		document.getElementById("specView").innerText = row.spec;
		document.getElementById("addressView").innerText = row.address;
		document.getElementById("remarkView").innerText = row.remark;
	}

	//格式化创建时间
	function formatDate(value, row){
		value = value + '';
		if(value == null || value.length == 0){
			return "";
		}
		var yy = '';
		var mo = '';
		var da = '';
		
		var ho = '';
		var mm = '';
		var ss = '';

		var dateTime = '';
		if(value.length > 4){
			yy = value.substr(0, 4);
			dateTime = dateTime + yy;
		}
		if(value.length > 6){
			mo = value.substr(4, 2);
			dateTime = dateTime + '-' + mo;
		}
		if(value.length > 8){
			da = value.substr(6, 2);
			dateTime = dateTime + '-' + da;
		}
		
		if(value.length > 10){
			ho = value.substr(8, 2);
			dateTime = dateTime + ' ' + ho;
		}
		if(value.length > 12){
			mm = value.substr(10, 2);
			dateTime = dateTime + ':' + mm;
		}
		if(value.length >= 14){
			ss = value.substr(12, 2);
			dateTime = dateTime + ':' + ss;
		}
		return dateTime;
	}

	//格式化操作
	function formatOper(value, row){
		var updateOper = "<font color='#C0C0C0'>修改</font>";
		var deleteOper = "<font color='#C0C0C0'>删除</font>";
		<%
		if(users.getCusAuth().indexOf("AUTH_U") >= 0){
		%>
			updateOper = "<a href='javascript:doUpdate();'>修改</a>";
		<%
		}
		if(users.getCusAuth().indexOf("AUTH_D") >= 0){
		%>
			deleteOper = "<a href='javascript:doDelete();'>删除</a>";
		<%
		}
		%>
		return updateOper + '&nbsp;&nbsp;&nbsp;' + deleteOper + '&nbsp;&nbsp;&nbsp;';
	}

	//格式化价格
	function formatPrice(value, row){
		var tempValue = value + '';
		if(tempValue.indexOf(".") > 0){
			var arr = tempValue.split(".");
			if(arr[1].length == 1){
				tempValue = tempValue + "0";
			}else if(arr[1].length > 2){
				tempValue = arr[0] + arr[1].substr(0, 2);
			}
		}else{
			tempValue = tempValue + ".00";
		}
		return tempValue;
	}

	//准备新增数据
	function readyExport(){
		$('#cusExport').dialog({  
			title: '导出数据到Excel',  
			width: 200,
			height: 155,
			closed: false,  
			cache: false,   
			modal: true
		});
	}

	function exeExport(){
		var exportType = $("input[name='exportType']:checked").val() 
		
		var cids = '';
		var name = '';
		var linkman = '';
		var product = '';
		var fromDate = '';
		var toDat = '';
		
		if(exportType == 2){	
			var rowsItems = datagrid.datagrid('getRows');
			if(rowsItems.length == 0){
				$.messager.alert('提示', '<br>当前页没有任何数据。', 'info');
				return;
			}
			$.each(rowsItems, function(index, row){
				if(cids.length > 0){cids = cids + ',';}
				cids = cids + "'" +row.cid + "'";
			});
		}else if(exportType == 3){
			var queryParams = datagrid.datagrid('options').queryParams;
			name = queryParams.name;
			linkman = queryParams.linkman;
			product = queryParams.product;
			fromDate = queryParams.fromDate;
			toDat = queryParams.toDate;
		}else{
			$.messager.alert('提示', '<br>请选择导出Excel方式。', 'info');
			return;
		}

	    var form = $('<form></form>');  
	    // 设置属性  
	    form.attr('action', url + '?method=exportCustomerExcel&treeid=<%=treeid%>&islive=Y');  
	    form.attr('method', 'post');  
	    form.attr('target', '_self');  
	    // 创建Input  
	    var cidsInput = $('<input type="text" name="cids"/>');  
	    cidsInput.attr('value', cids);  
	    var nameInput = $('<input type="text" name="name"/>');  
	    nameInput.attr('value', name);  
	    var linkmanInput = $('<input type="text" name="linkman"/>');  
	    linkmanInput.attr('value', linkman);  
	    var productInput = $('<input type="text" name="product"/>');  
	    productInput.attr('value', product);
	    var fromDateInput = $('<input type="text" name="fromDate"/>');  
	    fromDateInput.attr('value', fromDate);  
	    var toDatInput = $('<input type="text" name="toDat"/>');  
	    toDatInput.attr('value', toDat);  

	    form.append(cidsInput);  
	    form.append(nameInput);  
	    form.append(linkmanInput);
	    form.append(productInput);  
	    form.append(fromDateInput);  
	    form.append(toDatInput); 

	    form.appendTo("body") 

	    form.submit();  
	}
	</script>

	<div data-options="region:'center',title:'客户信息管理'">
	
	<!-- 表格面板 -->
	<table id="datagrid"></table>
	
	<!-- 新增或编辑面板 -->
	<div id="customerSaveOrUpdate" class="easyui-dialog" closed="true" data-options="buttons:'#buttonsSaveOrUpdate'" style="padding-top:10px;padding-right:10px;overflow:hidden">
	    <form id="customerSaveOrUpdateForm" name="customerSaveOrUpdateForm" action="" method="post">
	    	<input type="hidden" id="cid" name="cid" value="">
	    	<table border="0" bordercolor="red">
				<tr height="30px">
	    			<td width="100px" align="right">客户公司</td>
	    			<td><input style="width:320px" class="easyui-validatebox" type="text" id="name" name="name" data-options="validType:['length[0,200]']"/></td>
	    			<td width="100px" align="right">联系人</td>
	    			<td><input style="width:320px" class="easyui-validatebox" type="text" id="linkman" name="linkman" data-options="validType:['length[0,50]']"/></td>
	    		</tr>
	    		<tr height="30px">
	    			<td align="right">固定电话</td>
	    			<td><input style="width:320px" class="easyui-validatebox" type="text" id="tel" name="tel" data-options="validType:['length[0,600]']"/></td>
	    			<td align="right">移动电话</td>
	    			<td><input style="width:320px" class="easyui-validatebox" type="text" id="phone" name="phone" data-options="validType:['length[0,600]']"/></td>
	    		</tr>
	    		<tr height="30px">
	    			<td align="right">电子邮箱</td>
	    			<td><input style="width:320px" class="easyui-validatebox" type="text" id="email" name="email" data-options="validType:'email'"/></td>
	    			<td align="right">地址</td>
	    			<td><input style="width:320px" class="easyui-validatebox" type="text" id="address" name="address" data-options="validType:['length[0,200]']"/></td>
	    		</tr>
	    		<tr height="30px">
	    			<td align="right">产品</td>
	    			<td><input style="width:320px" class="easyui-validatebox" type="text" id="product" name="product" data-options="validType:['length[0,200]']"/></td>
	    			<td align="right">规格</td>
	    			<td><input style="width:320px" class="easyui-validatebox" type="text" id="spec" name="spec" data-options="validType:['length[0,300]']"/></td>
	    		</tr>
	    		<tr height="30px">
	    			<td align="right">价格</td>
	    			<td><input style="width:320px" class="easyui-numberbox" type="text" id="price" name="price" data-options="precision:2,min:0.00,max:9999999999.99" value="0.00"/></td>
	    			<td align="right">排序</td>
	    			<td><input style="width:320px" class="easyui-numberbox" type="text" id="sort" name="sort" data-options="validType:['length[0,6]']" value="0"/></td>
	    		</tr>
	    		<tr>
	    			<td align="right">备注</td>
	    			<td colspan="3"><textarea style="width:100%;height:60px;resize:none;" id="remark" name="remark" maxlength="5000"></textarea></td>	    			
	    		</tr>
	    	</table>
	    </form>
	</div>
	<div id="buttonsSaveOrUpdate" style="display:none">
		<a href="javascript:void(0)" class="easyui-linkbutton" onclick="javascript:doSave(false)">保存</a>
		<span id="saveAndGoon">
		<a href="javascript:void(0)" class="easyui-linkbutton" onclick="javascript:doSave(true)">保存并继续新增</a>
		</span>
		<a href="javascript:void(0)" class="easyui-linkbutton" onclick="javascript:$('#customerSaveOrUpdate').dialog('close');">关闭</a>
	</div>
	
	<!-- 导出面板 -->
	<div id="cusExport" class="easyui-dialog" closed="true" data-options="buttons:'#buttonsCusExport'" style="padding-top:10px;overflow:hidden">
	    	<table border="0" bordercolor="red">
	    		<tr height="25px">
	    			<td style="padding-left:20px"><input type="radio" id="" name="exportType" value="2"/></td><td style="padding-left:5px">导出当前页数据</td>
	    		</tr>
	    		<tr height="25px">
	    			<td style="padding-left:20px"><input type="radio" id="" name="exportType" value="3"/></td><td style="padding-left:5px">导出所有数据</td>
	    		</tr>
	    	</table>
	</div>
	<div id="buttonsCusExport" style="display:none">
		<a href="javascript:exeExport();" class="easyui-linkbutton">导出</a>
		<a href="javascript:void(0)" class="easyui-linkbutton" onclick="javascript:$('#cusExport').dialog('close');">取消</a>
	</div>
	
	<!-- 增，删，改，查面板 -->
	<div id="tb" style="padding:0px;height:auto">
		<table width="100%" border="0" bordercolor="red">
			<tr>
				<td style="padding-right:10px">
					<%if(users.getCusAuth().indexOf("AUTH_A") >= 0){
					%>
					<a href="javascript:readySave();" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-add'">新增</a>
					<%
					}else{
					%>
					<a href="javascript:void(0);" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-add'" style="color:#C0C0C0">新增</a>
					<%	
					}%>
				</td>
				<td>客户公司:</td>
				<td><input id="name" name="name" class="easyui-validatebox" style="width:80px;height:20px"/></td>			
				<td style="padding-left:10px">联系人:</td>
				<td><input id="linkman" name="linkman" class="easyui-validatebox" style="width:80px;height:20px"/></td>
				<td style="padding-left:10px">产品:</td>
				<td><input id="product" name="product" class="easyui-validatebox" style="width:80px;height:20px"/></td>
				<td>创建时间:</td>
				<td>				
					<input id="fromDate" name="fromDate" class="Wdate" type="text" style="width:90px;height:20px" onFocus="var toDate=$dp.$('toDate');WdatePicker({dateFmt:'yyyy-MM-dd',readOnly:true,isShowClear:true,onpicked:function(){toDate.focus();},maxDate:'#F{$dp.$D(\'toDate\')}'})"/>	
				</td>
				<td align="center">至</td>
				<td>				
					<input id="toDate" name="toDate" class="Wdate" type="text" style="width:90px;height:20px" onFocus="WdatePicker({dateFmt:'yyyy-MM-dd',readOnly:true,isShowClear:true,minDate:'#F{$dp.$D(\'fromDate\')}'})"/>	
				</td>
				<td style="padding-left:5px">
					<a href="javascript:doQuery();" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-search'">查询</a>
				</td>								
			</tr>
		</table>
	</div>
	
	
	</div>
	<!-- 详细信息面板 -->
	<div data-options="region:'south',border:false" style="height:110px;background:#D8D8D8;padding:0px;">
		<table width="100%" border="0" bordercolor="red">
			<tr height="25px">
				<td width="9%" align="right" bgcolor="#CCDDFF">客户公司：</td><td width="41%" bgcolor="#F8F8F8"><span id="nameView"></span></td>
				<td width="9%" align="right" bgcolor="#CCDDFF">联系人：</td><td width="41%" bgcolor="#F8F8F8"><span id="linkmanView"></span></td>
			</tr>
			<tr height="25px">				
				<td bgcolor="#CCDDFF" align="right">产品：</td><td bgcolor="#F8F8F8"><span id="productView"></span></td>
				<td bgcolor="#CCDDFF" align="right">规格：</td><td bgcolor="#F8F8F8"><span id="specView"></span></td>
			</tr>
			<tr height="25px">
				<td bgcolor="#CCDDFF" align="right">地址：</td><td colspan="3" bgcolor="#F8F8F8"><span id="addressView"></span></td>
			</tr>
			<tr height="25px">
				<td bgcolor="#CCDDFF" align="right">备注：</td><td colspan="3" bgcolor="#F8F8F8"><span id="remarkView"></span></td>
			</tr>
		</table>
	</div>
  </body>
</html>
